<template>
  <div class="cz_brand">
    <img src="images/title0.png" alt />
    <ul>
      <li>
        <a href="#">
          <img src="images/brand1.png" alt />
        </a>
      </li>
      <li>
        <a href="#">
          <img src="images/brand2.png" alt />
        </a>
      </li>
      <li>
        <a href="#">
          <img src="images/brand3.png" alt />
        </a>
      </li>
      <li>
        <a href="#">
          <img src="images/brand4.png" alt />
        </a>
      </li>
      <li>
        <a href="#">
          <img src="images/brand5.png" alt />
        </a>
      </li>
      <li>
        <a href="#">
          <img src="images/brand6.png" alt />
        </a>
      </li>
      <li>
        <a href="#">
          <img src="images/brand7.png" alt />
        </a>
      </li>
      <li>
        <a href="#">
          <img src="images/brand8.png" alt />
        </a>
      </li>
    </ul>
  </div>
</template>

<style scoped>
.cz_brand {
  padding: 0 10px;
}
.cz_brand > img {
  width: 100%;
}

.cz_brand ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.cz_brand ul li {
  width: 25%;
  float: left;
}
.cz_brand ul li a {
  display: block;
}
.cz_brand ul li a img {
  width: 100%;
}
</style>